<!--
  This file is a part of the open-eBackup project.
  This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  If a copy of the MPL was not distributed with this file, You can obtain one at
  http://mozilla.org/MPL/2.0/.
  
  Copyright (c) [2024] Huawei Technologies Co.,Ltd.
  
  THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
  EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
  MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
  -->

<lv-form [lvLabelColon]='false' class="formGroup">
    <h2>{{basicInfoLabel}}</h2>
    <lv-form-item>
        <lv-form-label>{{nameLabel}}</lv-form-label>
        <lv-form-control>
            <span>{{mediaSet.mediaSetName}}</span>
        </lv-form-control>
    </lv-form-item>
    <lv-form-item>
        <lv-form-label>
            {{blockSizeLabel}}
        </lv-form-label>
        <lv-form-control>
            {{mediaSet.blockSize}}
            <span>KB</span>
        </lv-form-control>
    </lv-form-item>
    <lv-form-item>
        <lv-form-label>
            {{compressionLabel}}
        </lv-form-label>
        <lv-form-control>
            {{mediaSet.compressionStatus | textMap : 'Archive_Compression_Status'}}
        </lv-form-control>
    </lv-form-item>
    <h2>{{selectedTapesLabel}}</h2>
    <lv-form-item>
        <lv-form-label>{{typeLabel}}</lv-form-label>
        <lv-form-control>
            <span>{{mediaSet.type}}</span>
        </lv-form-control>
    </lv-form-item>
    <lv-form-item>
        <lv-form-label>{{controllerLabel}}</lv-form-label>
        <lv-form-control>
            <span>{{mediaSet.node}}</span>
        </lv-form-control>
    </lv-form-item>
    <lv-form-item>
        <lv-form-label>{{tapeLabel}}</lv-form-label>
        <lv-form-control>
            <span>
                {{'system_total_tape_label' | i18n: []: true}}{{totalTape}}{{semicolonLabel}}
                {{'system_available_total_tape_label' | i18n: []: true}}{{totalAvailableTape}}
            </span>
        </lv-form-control>
    </lv-form-item>
    <lv-group class="group" *ngIf="libraries.length">
        <lv-group class="left" lvDirection='vertical'>
            <div class="library-container">
                <lv-menu [lvMenus]="libraries" [lvMode]="'icon'" [lvTheme]="'light'" [(lvActiveItemId)]="active"
                    (lvItemClick)="itemClick($event)" class="library-select"></lv-menu>
            </div>
        </lv-group>
        <div class="slip"></div>
        <lv-group class="right aui-paginator-container">
            <div class="info-container">
                <lv-pro-table #tapeTable [config]="tapeTableConfig" [data]="tapeTableData"></lv-pro-table>
            </div>
        </lv-group>
    </lv-group>
    <div class="tape-no-data" *ngIf="!libraries.length">
        <lv-empty></lv-empty>
    </div>
    <div class="alarm-switch" *ngIf="mediaSet.alarmEnable">
        <span class="capacity-alarm-threshold">{{insufficientLabel}}</span>
    </div>
    <ng-container *ngIf="mediaSet.alarmEnable">
        <lv-form-item>
            <lv-form-label>
                {{'common_alarm_threshold_label' | i18n}}
            </lv-form-label>
            <lv-form-control>
                <span>{{mediaSet.alarmThreshold}}</span>
            </lv-form-control>
        </lv-form-item>
    </ng-container>
    <h2 class="form-header">{{rentainLabel}}</h2>
    <lv-form-item>
        <lv-form-label>
            <span>{{'system_archive_retention_range_label' | i18n}}</span>
        </lv-form-label>
        <lv-form-control>
            <span>{{retentionType}}</span>
        </lv-form-control>
    </lv-form-item>
    <ng-container *ngIf="mediaSet.retentionType === dataMap.Tape_Retention_Type.temporary.value">
        <lv-form-item>
            <lv-form-label></lv-form-label>
            <lv-form-control>
                <lv-group lvGutter='8px' class="group-control">
                    <lv-group>
                        <span>{{mediaSet.retentionDuration}}</span>
                    </lv-group>
                    <lv-group>
                        <span>{{retentionUnit}}</span>
                    </lv-group>
                </lv-group>
            </lv-form-control>
        </lv-form-item>
    </ng-container>
</lv-form>
<ng-template #capacityTpl let-item>
    {{item.usedCapacity ? (item.usedCapacity | capacityCalculateLabel:'1.1-3':unitconst.MB: true) : '--'}}
</ng-template>
